@charset "utf-8";
/* h5 note */

body {color: #666;}

/* 公共样式 */
.note_sprite,.public_sprite {background-repeat: no-repeat;}
.note_sprite {background-image: url(/mobile/images/post/note/note_sprite_v4.png);background-size: 262px 158px;}
.public_sprite {background-image: url(/mobile/images/post/note/public_sprite_v2.png);background-size: 251px 81px;}
.mlr5 {margin: 0 5px;}
.opacity0 {opacity: 0;visibility: hidden;}

/* 头部 */
/* 头部banner等 */
.top_pic {position: relative;height: 180px;}
.tp_img {height: 100%;overflow: hidden; background:url(/mobile/images/post/note/note_topbg.jpg) center center; background-size:cover}
.tp_img img {height: 100%;}

.tp_links {position: absolute;right: 4.6875%;top: 5.5556%;}
.tp_links a {float: left;width: 34px;height: 34px;margin-left: 10px;}
.tp_links .tp_collect {background-position: -34px 0;}
.tp_links .tp_collected {background-position: -170px 0;}
.tp_links .tp_share {background-position: -68px 0;}

.tp_title {position: absolute;bottom: 8px;right: 15px;left: 80px;}
.tp_title h1 {font-size: 17px;line-height: 20px;color: #fff;}

/* 个人信息等 */
.top_person {display: table;width: 100%;height: 50px;border-bottom: 1px solid #d7d7d7;}
.tp_ava,.tp_info,.tp_others {display: table-cell;padding-top: 9px;}
.tp_ava {width: 60px;position: relative;padding: 0 10px;}
.tp_ava a {position: absolute;top: -40px;width: 60px;}
.tp_ava img {border-radius: 50%;width: 100%;}
.tp_ava .fengshou {width: 18px;height: 19px;background-position: 0 0;position: absolute;left: 54px;top: 1px;}

.tp_info p {line-height: 20px;position: relative;top: -3px;}
.tp_info .name {color: #ff7200;margin-right: 3px;}
.tp_info .rating {color: #ea3c1a;font-size: 10px;font-weight: bold;}
.tp_info .time {font-size: 10px;color: #999;}

.tp_others {width: 70px;text-align: center;border-left: 1px solid #e8e8e6;}
.tp_others i,.note_more li .view i {width: 15px;height: 12px;background-position: -157px 0;display: inline-block;}
.tp_comment i {background-position: -174px 0;}
.tp_others p {margin-top: 5px;font-size: 11px;color: #666;}
.tp_comment {width: 50px;}

/*  游记主体 */
/* 出行信息 */
.note {padding-bottom: 50px;}
.note section {padding: 0 10px;}
.note .note_tags {height: 80px;background-color: #f6f6f6;border-bottom: 1px solid #e7e7e7;overflow-x: auto;padding: 0;position: relative;-webkit-overflow-scrolling: touch;}
.note_tags ul {width: 800px;}
.note_tags li {float: left;padding-top: 15px;text-align: center;color: #999;width: 82px;}
.note_tags li span {color: #666;}
.note_tags li i {width: 29px;height: 29px;display: inline-block;}
.note_tags .begin_date {background-position: 0 -73px;}
.note_tags .all_days {background-position: -30px -73px;}
.note_tags .travel_style {background-position: -60px -73px;}
.note_tags .average_cost {background-position: -91px -73px;}
.note_tags .travel_style {background-position: -124px -73px;}
.note_tags li p {margin-top: 8px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

/* 游记内容 */
.note_detail h2 {text-align: center;margin: 25px auto 10px;}
.note_detail h2 span {display: inline-block;font-size: 17px;line-height: 22px;padding: 0 2px;border-bottom: 2px solid #ffc148;}

.ard_list p {padding: 0 5px;line-height: 22px;font-size: 14px;color: #777;}
.ard_list a {color: #ffa800;}
.ard_pic {margin: 10px 0;}
.ard_pic img {width: 100%;}
.ard_poi {margin-top: 5px;font-size: 11px;color: #999;}
.ard_poi i,.ard_poi span {line-height: 18px;vertical-align: middle;}
.ard_poi i,.nn_list .poi_ico {margin-right: 5px;display: inline-block;width: 18px;height: 18px;background-position: 0 -22px;}
.ard_poi .restaurant {background-position: 0 -40px;}
.ard_poi .hotel {background-position: 0 -58px;}

/* 加载更多&&loading */
.note .ard_loading {font-size: 14px;line-height: 22px;text-align: center;padding: 28px 0 33px;border-bottom: 1px solid #d7d7d7;color: #999;}
.an_loading {overflow: hidden;color: #999;display: inline-block;vertical-align: middle;margin-right: 2px;}
.an_loading i {width: 5px;height: 12px;float: left;margin-right: 5px;background-color: #f39c11;border-radius: 12px;-webkit-animation: note_loading 1s linear 0s infinite;}
.an_loading i:nth-child(2) {-webkit-animation-delay: .33s;}
.an_loading i:nth-child(3) {-webkit-animation-delay: .66s;}
@-webkit-keyframes note_loading {
	50% {-webkit-transform: scaleY(.4);}
}

/* 收藏分享等操作 */
.note .note_handle {padding: 14px 0;border-bottom: 1px solid #d7d7d7;margin: 0 15px;}
.note_handle ul {display: table;width: 248px;margin: 0 auto;}
.note_handle li {width: 42px;display: table-cell;padding: 0 10px;text-align: center;}
.note_handle li i {width: 42px;height: 38px;background-position: -42px -34px;display: inline-block;}
.note_handle .collected .ah_collect {background-position: 0 -34px;}
.note_handle li .ah_share {background-position: -84px -34px;}
.note_handle li .ah_comment {background-position: -126px -34px;}
.note_handle li .ah_ding {background-position: -168px -34px;}
.note_handle li p {font-size: 11px;color: #666;margin-top: 5px;}

/* 更多游记 */
.note_more dl {padding-top: 25px;color: #666;}
.note_more dt {height: 15px;line-height: 15px;border-left: 2px solid #ffa800;padding-left: 10px;font-size: 14px;}
.note_more dt strong {font-weight: normal;color: #ff7200;margin: 0 2px;}
.note_more dd {margin-top: 6px;}
.note_more li {padding: 8px 3px;border-bottom: 1px dotted #d7d7d7;}
.note_more li a {color: #666;font-size: 13px;line-height: 22px;}
.note_more li p {color: #999;font-size: 10px;line-height: 12px;}
.note_more li p span {margin-right: 10px;}
.note_more li p span span {vertical-align: middle;}
.note_more li .view i {vertical-align: middle;margin-right: 3px;}

/* 游记目录 */
.note_nav {width: 71.875%;position: fixed;left: -72%;top: 0;bottom: 0;background-color: #fff;border-top: 1px solid #b1b3b2;border-right: 1px solid #b1b3b2;z-index: 30;-webkit-transition: left .4s ease-out 0s;}
.note_nav.expand {left: 0;}
.nn_detail {height: 100%;overflow-y: auto;}
.nn_title {background-color: #f6f6f6;padding: 13px 10px 13px 15px;line-height: 34px;display: table;box-sizing: border-box;width: 100%;position: absolute;z-index: 10;}
.nn_title i {width: 34px;height: 34px;display: table-cell;background-position: -102px 0;position: relative;}
.nn_title.guide_for_users i:before,.nn_title.guide_for_users i:after {content: "";background-color: rgba(255,138,0,.5);position: absolute;left: 0;top: 0;border-radius: 30px;}
.nn_title.guide_for_users i:before {width: 34px;height: 34px;}
.nn_title.guide_for_users i:after {width: 36px;height: 36px;left: -1px;top: -1px;background-color: rgba(255,138,0, .3);-webkit-animation: shining 1s ease-out 0s infinite;}
.nn_title h2 {font-size: 19px;display: table-cell;}

.nn_list {padding-top: 60px;}
.nn_list li {border-bottom: 1px solid #e7e7e7;}
.nn_list dl {padding: 15px;}
.nn_list dt {font-size: 14px;line-height: 24px;padding: 8px 0;position: relative;}
.nn_list dt:before {content: "";position: absolute;width: 2px;top: 0;bottom: 0;left: -15px;line-height: 0;background-color: #fff;}
.nn_list dt span {color: #ff8a00;}
.nn_list dd {margin: 14px 0 0 24px;position: relative;display: none;}
.nn_list .on dt {color: #ff8a00;}
.nn_list .on dt:before {background-color: #ffc148;}
.nn_list .on dd {display: block;}
.nn_list i.poi_ico {position: absolute;left: -24px;background-position: 0 -22px;}
.nn_list i.house {background-position: 0 -22px;}
.nn_list i.hotel {background-position: -18px -22px}
.nn_list i.food {background-position: -36px -22px;}
.nn_list i.play {background-position: -75px -22px;}
.nn_list i.plane {background-position: -100px -22px;}
.nn_list i.shopping {background-position: -125px -22px;}
.nn_list i.mdd {background-position: -175px -22px}


.nn_list dd strong {font-size: 13px;line-height: 20px;font-weight: normal;}
.star,.star i {display: block;height: 12px;line-height: 0;}
.star {width: 66px;background-position: -89px 0;position: relative;}
.star i {background-position: -21px 0;position: absolute;left: 0;top: 0;}
.star1 i {width: 12px;}
.star2 i {width: 26px;}
.star3 i {width: 39px;}
.star4 i {width: 53px;}
.star5 i {width: 66px;}

/* 底部菜单 */
.footer {left: 0;right: 0;position: fixed;bottom: 0;padding-bottom:0;background-color: #fff;background-color: rgba(255,255,255,.97);height: 50px;border-top: 1px solid #ccc;z-index: 30;box-shadow: 0 -2px 3px rgba(0,0,0,.14);}
.footer_bar {display: table;width: 100%;}
.fb_item {display: table-cell;padding: 18px 10px;line-height: 14px;font-size: 14px;}
.fb_item i,.fb_item span {vertical-align: middle;}
.fb_item i {width: 18px;height: 16px;background-position: -214px 0;display: inline-block;margin-right: 3px;position: relative;}
.fb_item.guide_for_users i:before,.fb_item.guide_for_users i:after {content: "";background-color: rgba(255,138,0,.5);position: absolute;left: -5px;top: -6px;border-radius: 30px;}
.fb_item.guide_for_users i:before {width: 28px;height: 28px;}
.fb_item.guide_for_users i:after {width: 30px;height: 30px;left: -6px;top: -7px;background-color: rgba(255,138,0, .3);-webkit-animation: shining 1s ease-out 0s infinite;}
@-webkit-keyframes shining {
	0%, 100% {-webkit-transform: scale(1);}
	50% {-webkit-transform: scale(1.6);}
}
.fb_comment i {background-position: -191px 0;}
.fb_ding {padding: 0 23px 0 0;position: relative;top: 6px;text-align: right;}
.fb_ding a {width: 44px;height: 40px;background-position: -210px -32px;position: absolute;top: -27px;}
.fb_ding span {width: 40px;text-align: center;display: inline-block;}

.go_up a {width: 47px;height: 47px;background-position: 0 -104px;position: fixed;bottom: 85px;right: 18px;}

/* 评论页 */
.comment {padding-bottom: 50px;}
.comment_detail h1 {padding: 25px 20px;background-color: #f6f6f6;font-size: 17px;color: #444;line-height: 23px;border-bottom: 1px solid #e7e7e7;}
.comment_lsit li {position: relative;margin-left: 60px;padding: 16px 15px 13px 0;border-bottom: 1px solid #d7d7d7;line-height: 18px;}
.comment_lsit li:last-child {border-bottom: none;}
.comment_lsit .cl_ava img {position: absolute;left: -45px;top: 16px;width: 34px;border-radius: 34px;}
.comment_lsit .cl_name {color: #ff7200;margin-right: 2px;}
.comment_lsit .cl_rating {font-weight: bold;color: #ea3c1a;font-size: 10px;}
.comment_lsit .cl_reply {position: absolute;right: 15px;top: 15px;font-size: 14px;color: #ff8a00;}
.comment_lsit .cl_time {color: #999;font-size: 10px;}
.cl_con {margin-top: 10px;font-size: 14px;line-height: 20px;}
.cl_quote {display: block;color: #999;margin-bottom: 8px;padding-right: 5px;font-size: 12px;}
.cl_quote_img img {display: block;margin: 8px 0 12px;width: 100%;}

.show_more a {display: block;padding: 12px;margin: 0 15px;border-top: 1px solid #d7d7d7;text-align: center;color: #ff8a00;font-size: 14px;line-height: 20px;}
.show_more a i {display: inline-block;background-position: -233px -3px;width: 15px;height: 11px;margin-left: 2px;}

/* 底部回复 */
.footer_comment {height: 55px;}
.comment_replay {padding: 10px 15px;}
.comment_replay input {padding: 0 13px;display: block;width: 100%;box-sizing: border-box;background-color: #eee;border: none;border-radius: 3px;line-height: 35px;font-size: 14px;color: #999;outline: none;}

/* 回复框展开 */
.reply_box {width: 100%; height: 100%; position: fixed; top: 0;bottom: 0; left: 0; min-height: 480px; border-top: none;  overflow: hidden;z-index: 98;display: none;}
.bgef {background: #efefef;}
.reply_box .re-hd{ height:43px; background-color:#fff; text-align:center; font-size:18px; color:#333; line-height:43px; border-bottom:1px solid #f29406; position:absolute; top:0; left:0; width:100%; display:block;}
.reply_box a.close{ position:absolute; width:44px; height:48px; display:block; top:0px; left:0px;}
.reply_box a.close i{ width:23px; height:16px; display:block; background:url(/mobile/images/post/footbar.png) 0px 0px no-repeat; margin:16px 0 0 14px; background-size:25px 300px;}
.reply_box a.submit{ position:absolute; width:44px; height:48px; display:block; top:0px; right:0px;}
.reply_box a.submit i{ width:23px; height:16px; display:block; background:url(/mobile/images/post/footbar.png) 0 -20px no-repeat; margin:13px 0 0 10px; background-size:25px 300px;}
.reply_box .reply_title {width:100%; margin:0 auto; border:none; padding:48px 0 0;}
.reply_box .textarea{ width:auto; min-height: 500px; border-radius:4px; background:#fff; text-indent:0; padding:4px; max-height:82px; overflow-x:hidden; overflow-y:auto; font-size:18px; line-height:1.2em; margin:4px 9px 0; color:#666; text-align:left; outline:0;}

/* 分享展开 */
.sharepop{ width:100%; position:absolute; left:0; top:0px;height: 100%; background-color:#fff; z-index: 10;}
.sharepop .hd{ font-size:16px; color:#333; padding:16px 0 12px; line-height:1em; text-align:center; border-bottom:1px solid #f29406;}
.sharepop .close-pop{ clear:both;width:300px;margin:0 auto; padding:10px;}
.sharepop .close-pop a{ font-size:16px; color:#333; padding:6px 0; border-radius:5px; text-align:center; display:block; background-color:#e6e6e6; border:1px solid #cbcbcb;}
.sharepop ul{ width:322px; position:relative; z-index:10; margin:0 auto; padding:10px 0 15px;}
.sharepop li{ width:105px; height:89px; float:left;}
.sharepop li a{ display:block; width:106px; height:64px; padding-top:25px; text-align:center; font-size:12px; color:#666;line-height: 44px;position: relative;}
.sharepop li i{ width:22px; height:20px; display:block; background:url(/mobile/images/post/footbar.png) no-repeat; background-size:25px 300px; margin-left:45px;}
.sharepop li .weibo{ background-position:0px -50px;}
.sharepop li .qq{ background-position:0px -80px;}
.sharepop li .weixin{ background-position:-50px -150px;}
.sharepop li .renren{ background-position:0 -110px;}
.sharepop li .home{ background-position:0px -165px;}
.sharepop li .mdd{ background-position:0px -140px;}
.sharepop li .ding{ background-position:-175px -195px;}
.graylayout{ width:100%; height:960px; position:absolute; background-color:#000; opacity:0.75; top: 305px; z-index:9;}

/* 地图页 */
html,body,.schedule_map,.map_detail,.map_content {height: 100%;}
.map_detail {width: 100%;position: relative;}
.go_back i {width: 34px;height: 34px;position: absolute;left: 15px;top: 15px;background-position: -136px 0;}

.areas_list {position: absolute;bottom: 5px;left: 0;width: 100%;overflow: hidden;height: 125px;padding: 20px 0 5px;}
.areas_list li {padding: 0 25px;position: absolute;left: 0;bottom: 5px;width: 100%;box-sizing: border-box;}
.areas_list dl {padding: 10px;height: 120px;background-color: #fff;border-radius: 10px;width: 100%;box-sizing: border-box;box-shadow: 0 0 4px rgba(0,0,0,.2);}
.areas_list dt {width: 100px;height: 100px;position: relative;float: left;}
.areas_list dt img {width: 100%;}
.areas_list dt p {height: 30px;line-height: 30px;position: absolute;left: 0;bottom: 0;right: 0;background-color: #000;background-color: rgba(0,0,0,.7);text-align: center;font-size: 14px;color: #fff;}
.areas_list dd {padding-left: 10px;position: relative;vertical-align: top;height: 100%;margin-left: 100px;}
.areas_list .title a {line-height: 20px;font-size: 15px;padding-top: 2px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;display: block;}
.areas_list .star {margin-top: 5px;}
.areas_list .mention_note {margin-top: 4px;color: #999;font-size: 11px;}
.areas_list .view_gl {position: absolute;left: 10px;right: 0;bottom: 0;border: 1px solid #ffc148;border-radius: 3px;line-height: 28px;text-align: center;font-size: 13px;color: #ff8a00;}
.areas_list .num {padding: 3px;background-color: #fff;border-radius: 30px;position: absolute;top: -25px;right: 0;}
.areas_list .num span {display: block;background-color: #fc7634;padding: 3px 8px;line-height: 18px;font-size: 16px;color: #fff;border-radius: 30px;}

.areas_point {width: 24px;height: 29px;position: absolute;background-position: -50px -104px;color: #ffa800;text-align: center;line-height: 25px;}
.areas_point.current {background-position: -74px -104px;color: #fc7634;}

/*album*/
.albumPanel{ width:100%; height:100%; background:#000; position:absolute; top:0; left:0; z-index:99;}
.albumPanel .album-con{ margin:0 auto; overflow:hidden;}
.albumPanel .album-bar{ width:100%; height:50px; position:absolute; top:0px; left:0; background:rgba(0,0,0,.5); text-align:center;}
.albumPanel .album-bar a.back{width:50px; height:50px; display:block; background:url(/mobile/images/close.png) 13px 13px no-repeat; background-size:24px 24px; text-indent:-199px; overflow:hidden; position:absolute; top:0; left:0;}
.albumPanel .album-bar span{ color:#fff; font-size:18px; line-height:50px;}
.albumPanel .album-scene{ width:320px; display:table; margin:0 auto;}
.albumPanel .album-scene .pp{ text-align:center; vertical-align:middle; display:table-cell;}
.albumPanel .album-title{ width:320px; position:absolute; bottom:27px; text-align:center;}
.albumPanel .album-title span{display:inline-block;background:url(/mobile/images/albumbg.png) no-repeat; padding:0 10px; color:#999; font-size:14px; line-height:30px;}
.albumPanel .get-more{ width:250px; height:139px; background-color:#000; background-color:rgba(0,0,0,0.6); position:absolute; top:50%; left:50%; margin:-72px 0 0 -125px; border-radius:3px;}
.albumPanel .get-more .hd{ width:227px; height:52px; line-height:40px; margin:0 auto; background:url(/mobile/images/getmorehd.png) 0 38px no-repeat; background-size:227px 5px; font-size:15px; color:#fff; text-align:center;}
.albumPanel ul{ padding-left:11px;}
.albumPanel li{ margin-right:10px;width:69px; float:left;}
.albumPanel li img{ width:67px; height:67px; border:1px solid #fff; border-radius:1px;}
.albumPanel .flash-arrow{ width:16px; height:30px; opacity:0; position:absolute; top:50%;margin-top:-15px; right:20px;background:url(/mobile/images/flasharrow.png) no-repeat; background-size:16px 30px;-webkit-animation-name:"flasharrow";-webkit-animation-duration: 1.5s;-webkit-animation-iteration-count:3;z-index:2;}
@-webkit-keyframes 'flasharrow'{
    from{ opacity:0;}
    50%{ opacity:1;}
    100%{ opacity:0;}
}
